<template>
        <div>
            <!--查询条件start --111s-->
            <el-form :inline="true" :model="query" class="query-form" size="small">

                <!--0:待付款 1:待发货  2:待收货 3:已完成 4:退款-->
                <el-form-item label="订单状态：">
                    <el-select v-model="query.orderstatus" placeholder="请选择" @change="shelfstatus" clearable>
                      <el-option
                        label="待付款"
                        value='0'>
                    </el-option>
                    <el-option
                        label="待发货"
                        value='1'>
                    </el-option>
                    <el-option
                        label="待收货"
                        value='2'>
                    </el-option>
                    <el-option
                        label="已完成"
                        value='3'>
                    </el-option>
                    <el-option
                        label="关闭"
                        value='4'>
                    </el-option>
                    <el-option
                        label="取消"
                        value='5'>
                    </el-option>
                    </el-select>
                </el-form-item>

                <el-form-item class="query-form-item">
                    <el-input
                        v-model="query.content"
                        placeholder="订单号/买家/买家联系方式"
                        prefix-icon="el-icon-search"
                        @keyup.enter.native="onSubmit"
                        clearable
                        style="width: 480px"
                    ></el-input>
                </el-form-item>


                <el-form-item label="时间段：">
                    <el-date-picker
                        v-model="createTime"
                        type="datetimerange"
                        :picker-options="pickerOptions"
                        range-separator="-"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                        align="left"
                        format="yyyy-MM-dd HH:mm:ss"
                        value-format="yyyy-MM-dd HH:mm:ss"
                        :default-time="['00:00:00','23:59:59']"
                        @change="dateChange"
                    ></el-date-picker>
                </el-form-item>

                <el-form-item>
                    <el-button type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
                </el-form-item>

                <el-form-item>
                    <el-button type="primary"  @click="exportSignup">导出</el-button>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary"  @click="delOrder">删除</el-button>
                </el-form-item>

            </el-form>

            <!--列表start --222s-->
            <el-table
                ref="multipleTable"
                v-loading="loading"
                :data="list"
                :header-cell-style="{background:'#F4F4F5',color:'#606266'}"
                @selection-change="handleSelectionChange"
                @row-click="todetail"
                border
            >
        
                <el-table-column
                    label="ID/订单号"
                    prop="ordernumber">
                   
                </el-table-column>
                <el-table-column
                    label="客户信息" align="left">
                    <template slot-scope="scope">
                        【姓名】{{scope.row.useraddressname}}
                        </br>
                        【手机号】{{scope.row.useraddressphone}}
                        </br>
                        【地址】{{scope.row.provinceName}}
                        {{scope.row.cityName}}
                        {{scope.row.areaName}}
                        {{scope.row.useraddress}}
                    </template>
                </el-table-column>
                <el-table-column
                    label="数量/价格（元）"
                    prop="orderrealprice">
                </el-table-column>
                <el-table-column
                    label="支付方式状态"
                >
                    <template slot-scope="scope">
                        {{scope.row.paymenttype}}
                        </br>
                        {{scope.row.orderstatus}}
                    </template>
                </el-table-column>
                <el-table-column
                    label="运费"
                    prop="postage">
                </el-table-column>
                <el-table-column
                    label="获取积分"
                    prop="createintegral">
                </el-table-column>
                <el-table-column label="创建时间" with="300" :show-overflow-tooltip="true">
                    <template slot-scope="scope">
                        <i class="el-icon-time" v-if="scope.row.createtime!=null"></i>
                        <span
                            v-if="scope.row.createtime!=null"
                        >{{ scope.row.createtime | formatDateStr('yyyy-MM-dd hh:mm:ss') }}</span>
                    </template>
                </el-table-column>
            </el-table>
            <!--列表end --222e-->

            <!--分页模块start-->
            <el-pagination
                class="pagination-container"
                background
                :page-size="query.pageSize"
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                layout="total,sizes,prev, pager, next, jumper"
                :current-page="query.currentPage"
                :page-sizes="[10, 20, 30, 50]"
                :total="totalNumber"
            ></el-pagination>
            <!--分页模块end-->

        </div>
</template>
<script>
import { getMyOrderList, delMyOrder } from "../../api/mbuser/mbuser";
import { BASE_URL } from "../../config/app";
/*用作表单的数据初始化*/
const formJson = {
    orderid: 1,
    userid: 1,
    ordernumber: "", //订单号
    orderstatus: "",
    useraddressname: "",
    useraddressphone: "",
    provinceid: "",
    cityid: "",
    areaid: "",
    useraddress: "",
    orderrealprice: "",
    purchasetype: "",
    paymenttype: "",
    outtradeno: "",
    usercouponid: "",
    paytime: "",
    orderrealprice: "",
    postage: "",
    integralnum: "",
    orderrefundprice: "",
    createtime: "",
    exchangevalue: "",
    moneyvalue: "",
    orderisdel: "",
    secondordersPC: []
};
const formreceiving = {
    id: "",
    receivingdoodsdays: ""
};

export default {
    name: "order",
    data() {
        return {
            formData: formJson,
            pickerOptions: {
                //快速选择日期
                shortcuts: [
                    {
                        text: "最近一周",
                        onClick(picker) {
                            const end = new Date();
                            const start = new Date();
                            start.setTime(
                                start.getTime() - 3600 * 1000 * 24 * 7
                            );
                            picker.$emit("pick", [start, end]);
                        }
                    },
                    {
                        text: "最近一个月",
                        onClick(picker) {
                            const end = new Date();
                            const start = new Date();
                            start.setTime(
                                start.getTime() - 3600 * 1000 * 24 * 30
                            );
                            picker.$emit("pick", [start, end]);
                        }
                    },
                    {
                        text: "最近三个月",
                        onClick(picker) {
                            const end = new Date();
                            const start = new Date();
                            start.setTime(
                                start.getTime() - 3600 * 1000 * 24 * 90
                            );
                            picker.$emit("pick", [start, end]);
                        }
                    },
                    {
                        text: "最近六个月",
                        onClick(picker) {
                            const end = new Date();
                            const start = new Date();
                            start.setTime(
                                start.getTime() - 3600 * 1000 * 24 * 180
                            );
                            picker.$emit("pick", [start, end]);
                        }
                    }
                ]
            },
            query: {
                //查询条件
                content: "",
                userid: "", //用户id
                uids: "",
                flag: "",
                orderstatus: "", // <!--0:待付款 1:待发货  2:待收货 3:已完成 4:退款-->
                currentPage: 1,
                pageSize: 10,
                starttime: "",
                endtime: ""
            },
            createTime: [], //选择日期时需要的model
            list: [], //列表集合
            totalNumber: 0, //分页总页数
            // formVisible: false,//添加编辑显示
            loading: true, //列表加载
            formLoading: false, //表单提交加载
            allLoding: false, //全屏加载
            cancelToggle: false,
            detailVisible: false, //查看
            //multipleSelection: [], //多选集
            shouhuodata: {},
            shouhuo: formreceiving, //收货商城
            formName: "",
            formMap: {
                add: "自动收货期限"
            },
            formVisible: false //收货
        };
    },
    methods: {
        //订单详细
        todetail(row) {
            if (row !== null) {
                this.$router.push({
                    path: "/statistics/orderdetail",
                    query: { orderid: row.orderid }
                });
            }
        },
        //导出
        exportSignup() {
            let uid = "";
            if (this.query.userid) {
                uid = this.query.userid;
                window.location.href =
                    BASE_URL +
                    "/goldendays-user/mbUserManager/exportSignup?uid=" +
                    uid +
                    "&flag=0";
            }
            if (this.query.uids) {
                uid = this.query.uids;
                window.location.href =
                    BASE_URL +
                    "/goldendays-user/mbUserManager/exportSignup?uid=" +
                    uid +
                    "&flag=1";
            }
        }, //删订单
        delOrder() {
            this.loading = true;
            var params = new URLSearchParams();
            params.append("userid", this.query.userid);

            delMyOrder(params)
                .then(response => {
                    this.loading = false;
                    if (response.code) {
                        this.$message.error(response.message);
                        return false;
                    }
                    this.loading = false;
                    this.$message.success("更新成功");
                    // 刷新数据
                })
                .catch(() => {
                    this.loading = false;
                });
        },

        /*获取列表事件*/
        getList() {
            this.loading = true;
            this.list = [];
            console.info(this.query);
            getMyOrderList(this.query)
                .then(response => {
                    if (response.code != 0) {
                        this.$message.error(response.message);
                        return false;
                    }
                    let datalist = response.data.list || [];
                    if (datalist.length > 0) {
                        let mylist = datalist;
                        for (var i = 0; i < mylist.length; i++) {
                            if (mylist[i].orderstatus != null) {
                                mylist[i].orderstatus = mylist[
                                    i
                                ].orderstatus.toString();
                            }
                            if (mylist[i].orderstatus != null) {
                                mylist[i].orderstatus = mylist[
                                    i
                                ].orderstatus.toString();
                            }
                            if (mylist[i].secondordersPC != null) {
                                let sec = mylist[i].secondordersPC;
                                let num = null;
                                for (var j = 0; j < sec.length; j++) {
                                    let pur = sec[j].purchasenum;
                                    num = num + pur;
                                }
                                mylist[i].orderrealprice =
                                    num + "/" + mylist[i].orderrealprice;
                            }
                            if (mylist[i].paymenttype != null) {
                                mylist[i].paymenttype = mylist[
                                    i
                                ].paymenttype.toString();
                                if (mylist[i].paymenttype == "1") {
                                    mylist[i].paymenttype = "微信";
                                } else if (mylist[i].paymenttype == "2") {
                                    mylist[i].paymenttype = "支付宝";
                                } else if (mylist[i].paymenttype == "3") {
                                    mylist[i].paymenttype = "银联";
                                } else {
                                    mylist[i].paymenttype = "积分购买";
                                }
                            }
                            if (mylist[i].orderstatus != null) {
                                mylist[i].orderstatus = mylist[
                                    i
                                ].orderstatus.toString();
                                if (mylist[i].orderstatus == "0") {
                                    mylist[i].orderstatus = "待付款";
                                } else if (mylist[i].orderstatus == "1") {
                                    mylist[i].orderstatus = "待发货";
                                } else if (mylist[i].orderstatus == "2") {
                                    mylist[i].orderstatus = "待收货";
                                } else if (mylist[i].orderstatus == "3") {
                                    mylist[i].orderstatus = "已完成";
                                } else if (mylist[i].orderstatus == "4") {
                                    mylist[i].orderstatus = "关闭";
                                } else if (mylist[i].orderstatus == "5") {
                                    mylist[i].orderstatus = "取消";
                                } else {
                                    mylist[i].orderstatus = "";
                                }
                            }
                        }
                        this.list = mylist;
                    }

                    this.totalNumber = response.data.totalNumber || 0;
                    console.info(this.list);
                    setTimeout(() => {
                        this.loading = false;
                    }, 0.3 * 1000);
                })
                .catch(() => {
                    this.loading = false;
                    this.list = [];
                });
        },
        tableRowClassName() {
            return "success-row";
        },
        /*日期选择事件*/
        dateChange(val) {
            if (val == null) {
                this.query.starttime = "";
                this.query.endtime = "";
            } else {
                this.query.starttime = val[0];
                this.query.endtime = val[1];
                this.query.currentPage = 1;
            }

            this.getList();
        },
        /*列表查询条件事件*/
        onSubmit() {
            this.query.currentPage = 1;
            this.$router.push({
                path: "",
                query: this.query
            });
            this.getList();
        },
        //下拉框状态
        shelfstatus() {
            if (this.query.orderstatus === "0") {
                this.$router.push({
                    path: ""
                });
                //刷新事件需要重置查询条件
                this.createTime = [];
                this.query = {
                    currentPage: 1,
                    pageSize: 10
                };
                this.getList();
            } else {
                this.query.currentPage = 1;
                this.$router.push({
                    path: "",
                    query: this.query
                });
                this.getList();
            }
        },
        /*点击页数*/
        handleCurrentChange(val) {
            this.query.currentPage = val;
            this.getList();
        },

        /*选择每页条数【10,20,30,40,50】*/
        handleSizeChange(val) {
            this.query.pageSize = val;
            this.getList();
        },
        // 显示收货表单
        handleForm() {
            this.formVisible = true;
            this.formName = "add";
            this.shouhuo = Object.assign({}, this.shouhuodata);
            //this.getBusWarehouse();获取收货
        },
        hideForm() {
            // 更改值
            this.formVisible = !this.formVisible;
            return true;
        },
        /*列表复选框选择事件*/
        handleSelectionChange(val) {
            this.multipleSelection = val;
            if (val == "") {
                this.cancelToggle = false;
                return;
            }
            this.cancelToggle = true;
        }
    },
    mounted() {
        //我的订单
        if (this.$route.query.flag === "0") {
            this.query.userid = this.$route.query.uid;
            //alert(this.query.userid);
            // alert(this.query.userid);
        }

        //好友订单
        if (this.$route.query.flag === "1") {
            // alert("123")

            let id = this.$route.query.gid;
            this.query.uids = id;
            // alert(this.query.uids)
            this.query.flag = "1";
            this.query.userid = "";
        } else {
            //  alert("123456")
            this.query.flag = "0";
        }
        //    alert(this.userid)
    },
    created() {
        // alert("+"+this.userid);
        this.getList();
    }
};
//跳转路由的方法
// this.$router.push({
//     path: "",
//     query:{
//         username:"张三"
//     }
// });
//接受路由传递的参数
//let query = this.$route.query;
</script>
